<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>

    <title>Acced Form</title>

</head>
<body>

<div class="login">
    <h2 th:text="#{login.tip}">Acced Form</h2>
    <div class="login-top">
        <h1 th:text="#{login.top}">LOGIN FORM</h1>
        <form action="login.do">
            <div class="form-group">
                <input type="text" name="name" placeholder="Username" th:placeholder="#{login.username}" v-model="name"
                       required oninvalid="setCustomValidity('用户名不能为空！')" oninput="setCustomValidity('')"
                       onfocus="this.value = '';"
                       onblur="if (this.placeholder == '') {this.placeholder = 'Username';}">
            </div>
            <div class="form-group">
                <input type="password" name="pass" placeholder="******" v-model="pass" required
                       oninvalid="setstomValidity('密码不能为空Cu！')" oninput="setCustomValidity('')"
                       onfocus="this.value = '';"
                       onblur="if (this.placeholder == '') {this.placeholder = '******';}">
            </div>
            <div class="forgot">
                <a th:href="@{/login.do}" th:text="#{login.forgotpassword}">Forgot Password</a>
                <a href="#">|</a>
                <button type="submit" th:text="#{login.login}" value="Login"/>
                <a href="#">|</a>
                <a data-toggle="modal" data-target="#register" href="" th:text="#{login.register}">New User Register</a>
            </div>
        </form>
        <button type="button" @click="openAdd"></button>
    </div>

    <div class="login-bottom">
        <!--<h3>New User &nbsp;<a href="#">Register</a>&nbsp Here</h3>-->
        <a href="#" th:href="@{/login.html(l='zh_CN')}">中文</a>
    <a href="#">|</a>
    <a href="#" th:href="@{/login.html(l='en_US')}">English</a>
</div>

</div>

<script th:src="@{/myjs/login/main.js}"></script>
</body>

</html>